<template>
  <view class="user-menu-container">
    <!-- 顶部用户信息区域 -->
    <view class="user-header">
      <image class="avatar" src="/static/下载1.webp"></image>
      <text class="username">测试账户</text>
    </view>
    <!-- 功能列表区域 -->
    <u-cell-group>
    	<u-cell icon="account-fill" title="个人资料" :isLink="true" @click="goEdit"></u-cell>
    	<u-cell icon="pause-circle-fill" title="个人动态" :isLink="true" @click="goDt"></u-cell>
		<u-cell icon="chat-fill" title="消息" :isLink="true" ></u-cell>
		<hr />
		<u-cell icon="setting-fill" title="设置" :isLink="true"></u-cell>
		<u-cell icon="more-circle" title="反馈" :isLink="true" ></u-cell>
		<u-cell icon="question" title="关于" :isLink="true"></u-cell>
		<hr />
		<u-cell icon="person-delete-fill" title="退出账号" :isLink="true" @click="goOut"></u-cell>
    </u-cell-group>
  </view>
</template>

<script>

export default {
  data() {
    return {

    };
  },
  methods:{
	  
	  goEdit(){
	  		  uni.navigateTo({
	  		  	url:"/pages/user-edit/user-edit"
	  		  })
	  },
	  goOut(){
	  		  uni.navigateTo({
	  		  	url:"/pages/login/login"
	  		  })
	  },
	  goDt(){
	  		  uni.navigateTo({
	  		  	url:"/pages/user-dongtai/user-dongtai"
	  		  })
	  },
  },
  
  
};
</script>

<style scoped>
.user-menu-container {
  background-color: #fff;
  height: 100%;
}
.user-header {
  display: flex;
  align-items: center;
  padding: 30rpx;
  background-color: #6495ed;
}
.avatar {
  width: 80rpx;
  height: 80rpx;
  border-radius: 50%;
  margin-right: 20rpx;
}
.username {
  font-size: 32rpx;
  color: #fff;
}
.menu-list {
  border-top: 1px solid #f5f5f5;
}
.menu-item {
  display: flex;
  align-items: center;
  padding: 25rpx 30rpx;
  border-bottom: 1px solid #f5f5f5;
}
.menu-icon {
  width: 40rpx;
  height: 40rpx;
  margin-right: 20rpx;
}
.menu-text {
  flex: 1;
  font-size: 28rpx;
  color: #333;
}
.arrow {
  width: 20rpx;
  height: 36rpx;
}
</style>
